<div id="content">
	<div class="row s_page_title" >
		<sa-big-breadcrumbs [items]="['围栏管理','围栏绑定','卸货区域分配']" icon="fa fa-truck" class="col-xs-12 col-sm-7 col-md-7 col-lg-4"></sa-big-breadcrumbs>
	</div>
	<!--表格头部操作部分-->
	<div class="s_table" style="padding-left: 0;">
		<div class="page-header clearfix s_table_opreation" style="border-bottom: none;position: relative;">
			<div class="left page-header-btn">
				<div class="top_module">
					<span class="module_text">围栏类型</span>
					<select name="" id="" class="module_inp" [(ngModel)]="railType" style="width: 120px;">
						<option value="">全部</option>
						<option value="1">装货点</option>
						<option value="2">卸货点</option>
					</select>
				</div>
				
				<div class="top_module" >
					<span class="module_text">围栏名称</span>
					<input  class="module_inp"  type="text" style="padding-left: 12px;"  [(ngModel)]="railName" placeholder=" 围栏名称..."  />
				</div>
				<button type="button" class="btn btn-primary" (click)="search_data()">查询</button>
			</div>
			
			
		</div>
		<!--表格头部操作部分end-->
		<div style="background: white;height: 60vh;min-height: 628px;">
			<!--表格部分-->
			<div class="col-xs-12 col-sm-5 taskHtml" style="position: relative;height: 100%;">
				
				<div style="min-height: 31px;border: 1px solid #ccc; border-bottom: none;padding: 4px 10px;">
					<span>配置车辆 :</span><span *ngFor="let item of mapMarkerCarArr"> [{{item}}] </span>
				</div>
				<!--<div class="clearfix s_btn_group" >
		          	<button class="btn btn-primary" [ngClass]="{isAtive:btnNum === 'all'}" (click)="btnClick('all')" style="border-right: 1px solid #ddd;">全部 {{allTotal}}
		          	</button><button class="btn btn-primary" [ngClass]="{isAtive:btnNum === 'normal'}" (click)="btnClick('normal')" style="border-right: 1px solid #ddd;">卸货状态<span class="green">[正常] {{normalTotal}}</span>
		          	</button><button class="btn btn-primary" [ngClass]="{isAtive:btnNum === 'abnormal'}" (click)="btnClick('abnormal')" style="border-right: 1px solid rgb(238,238,238);">卸货状态<span class="red">[异常] {{abnormalTotal}}</span></button>
		        </div>-->
				<div sa-widget [editbutton]="false" color="darken" style="height: 100%;">
					<div style="padding: 0;">
						<sa-widgets-grid>
							<div class="s_table">
								<div sa-widget [editbutton]="false" color="darken" class="clearfix">
									<div>
										<div class="widget-body no-padding">
											<div class="table_scroll">
												<table class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table" style="margin: 0 !important;">
													<thead>
														<tr>
															<th>围栏名称</th>
															<th>围栏类型</th>
															<th>范围[米]</th>
														</tr>
													</thead>
													<tbody>                              
														<tr *ngFor="let row of tableData" [ngClass]="{selected:activeSelected === row.id}" (click)="rowSelectEvent(row)">
															<td>{{row.name}}</td>
															<td>
																<span *ngIf="row.typeId ==='1'">装货点</span>
																<span *ngIf="row.typeId ==='2'">卸货点</span>
															</td>
															<td>
																<span *ngIf="row.radius === 0">多边形</span>
																<span *ngIf="row.radius != 0">{{row.radius}}</span>
															</td>
														</tr>
													</tbody>
												</table>
											</div>
											<div class="table-fix clearfix">
												<paginator [totalRecords]="totalCount"
											           [rows]="fixPageSize"
											           [isPageSize]="false"
											           [currentPage]="curPage - 1"
											           (onPageChange)="paginate($event)">
												</paginator>
												<button type="button" class="btn default refresh_btn" (click)="refresh()"><i class="fa fa-refresh"></i></button>
											</div>
										</div>
									</div>
								</div>
							</div>
						</sa-widgets-grid>
					</div>
				</div>
			</div>
			<!--表格部分end-->
		
			<!--地图折线部分-->
			<div class="col-xs-12 col-sm-7" style="height: 100%;background: white;">  
				<div class="mapBox" style="height: 90%;border:1px solid #ccc;border-radius: 5px;" > 
				
					<div id="baiduMap" style="height: 100%;width: 100%;"></div>
				
				</div>
			</div>
			
		</div>
		<div class="center" style="background-color: #fff;padding-bottom: 24px;">
				<button type="submit" class="btn btn-primary" (click)="rail_bind()">配置</button>
				<button type="button" (click)='goBack()' class="btn default">返回</button>
			</div>
	</div>
	

	

</div>